<template>
  <div class="chat-x-switch">
    <x-switch 
      :title='title'
      :disabled='disabled'
      v-model='value'
      @on-change='onChange'
      @on-click='onClick'></x-switch>
  </div>
</template>

<script>
import XSwitch from 'vux/src/components/x-switch'
export default {
  components: {
    'x-switch': XSwitch
  },
  name: 'chatXSwitch',
  props: {
    disabled: {
      type: Boolean,
      default: false
    },
    title: {
      type: String,
      default: ''
    },
    valueMap: {
      type: Array,
      default: function() {
        return []
      }
    },
    vModelValue: {
      type: Boolean
    }
  },
  data() {
    return {
      value: this.vModelValue
    }
  },
  methods: {
    onChange(value) {
      this.$emit('on-change', value)
    },
    onClick(newVal, oldVal) {
      this.$emit('on-click', newVal, oldVal)
    }
  },
}
</script>
<style lang="scss" scoped>
@import '@css/globalCite/defaultVariable.scss';
@import '@css/globalCite/defaultThemeVariable.scss';
@import '@css/globalCite/themeMixin.scss';
@import '@css/components/chatXSwitch/fyChatXSwitch.scss';
</style>